<template>
  <img :src="src" @click="handleImageClick" v-bind="$attrs" />
</template>

<script lang="ts">
import { Component, Vue, Prop } from 'vue-property-decorator';
import { ImagePreview as VantImagePreview } from 'vant';

@Component
export default class ImagePreview extends Vue {
  @Prop({ default: '' }) src!: string;
  handleImageClick(e: MouseEvent) {
    const target = e.target as HTMLImageElement;
    const closeFn = VantImagePreview([target.src]);
    this.$store.dispatch('setImagePreviewCloseFn', closeFn.close);
  }
}
</script>
